import React  from "react";
import styles from './index.module.less'
import { inject,observer } from "mobx-react"
import { Button } from "antd";

@inject("MobxStore") // 引入mobx的sotre的MobxStore
@observer // MobxStore实例和组件双向绑定
class Mobx extends React.Component {
    setName = ()=>{
        const {MobxStore} = this.props;
        MobxStore.setName("ha ha ha")
    }
    setName2 = ()=>{
        const {MobxStore} = this.props;
        MobxStore.setName("hei hei hei")
    }
    render () {
        const {MobxStore} = this.props;
        return (
            <div>
                <p className={styles.test1}>Mobx</p>
                <p>store数据：{MobxStore.name}</p>
                <Button onClick={this.setName}>修改名字1</Button>
                <Button onClick={this.setName2}>修改名字2</Button>
            </div>
        )
    }
}

export default  Mobx